<template>
    <div class="boudoy">
        <div>
            <el-button @click="time()" >aa</el-button>
            <el-button @click="dialogFormVisible = true ">创建优惠卷</el-button>
            <el-dialog class="addCoupon" title="添加优惠卷" :visible.sync="dialogFormVisible" style="font-family: 微软雅黑">
                <ul>
                    <li>名称:
                        <el-input v-model="addjuan.cpName" placeholder="请输入内容"></el-input>
                    </li>
                    <li>价格:
                        <el-input v-model="addjuan.cePrice" placeholder="请输入内容"></el-input>
                    </li>
                    <li>优惠卷内容:
                        <el-input v-model="addjuan.cpContent" placeholder="请输入内容"></el-input>
                    </li>
                    <li>数量:
                        <el-input v-model="addjuan.cpNum" placeholder="请输入内容"></el-input>
                    </li>
                    <li>有效日期:<br/>
                        <el-date-picker
                                v-model="addjuan.cpBeginTime"
                                type="date"
                                placeholder="选择日期">
                        </el-date-picker>至
                        <el-date-picker
                                v-model="addjuan.cpEndTime"
                                type="date"
                                placeholder="选择日期">
                        </el-date-picker>
                    </li>
                    <el-button type="primary" style="float: right" @click="dialogFormVisible=false,queryAdd()">创建优惠卷</el-button>
                </ul>
            </el-dialog>
        </div>
        <div>
            <el-table
                    :data="tableData"
                    stripe
                    style="width: 100%;font-family: 微软雅黑">
                <el-table-column
                        prop="cpId"
                        label="编号"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="buName"
                        label="所属商家"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="cpContent"
                        label="优惠卷内容">
                </el-table-column>
                <el-table-column
                        prop="cpName"
                        label="优惠卷名称">
                </el-table-column>
                <el-table-column
                        prop="cpNum"
                        label="优惠卷数量">
                </el-table-column>
                <el-table-column
                        label="优惠卷状态">
                    <template slot-scope="scope">
                        <el-button v-if="scope.row.ucState==2"
                                   size="mini">正常</el-button>
                        <el-button  v-if="scope.row.ucState==1"
                                    size="mini"
                                    type="danger">已经使用</el-button>
                    </template>
                </el-table-column>
                <el-table-column
                        prop="cpBeginTime"
                        label="优惠卷发行时间">
                </el-table-column>
                <el-table-column
                        prop="cpEndTime"
                        label="优惠卷到期时间">
                </el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <el-button
                                size="mini"
                                type="danger"
                                @click="delet(scope.row.cpId)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination
                    background
                    layout="prev, pager, next"
                    @size-change="feny()"
                    @current-change="feny()"
                    :current-page.sync="saleQueryBo.page.current"
                    :page-size.sync="saleQueryBo.page.size"
                    :page-sizes="[1, 3, 5, 7, 10]"
                    :total="totlCount" style="margin-left: 600px">
            </el-pagination>
        </div>
    </div>
</template>

<script>
    export default {
        name: "Coupon",
        data()
        {
            return{
                currentTime:'',
                dialogFormVisible:false,
                date1: '',
                tableData:{
                    cpBeginTime: '2016-05-03',
                    cpName: '五一促销打折',
                    cpContent: '五一活动',
                    cpEndTime:'2016-05-08',
                    cpId:1,
                    buId:"王大拿",
                    cpNum:10,
                    ucState:""
                },
                saleQueryBo:{
                    page:{
                        current:1,
                        size:3
                    },
                    businessId:JSON.parse(sessionStorage.getItem("clerk")).clerkBusinessId
                },
                totlCount:null,
                addjuan:{
                    cpContent:null,
                    cpName:null,
                    cpNum:null,
                    cpBeginTime:null,
                    cpEndTime:null,
                    cePrice:null,
                    buId:JSON.parse(sessionStorage.getItem("clerk")).clerkBusinessId
                }
            }
        },
        mounted() {
            // this.$axios.post("administration/coupon/all",this.saleQueryBo).then(response=>{
            //     if (response.data!=null){
            //         this.tableData=response.data.records
            //     }
            //     this.totlCount=response.data.total
            // })
            this.feny();
        },
        methods:{
            feny(){
                this.$axios.post("administration/coupon/all",this.saleQueryBo).then(response=>{
                    if (response.data!=null){
                        this.tableData=response.data.records
                    }
                    this.totlCount=response.data.total
                })
            },
            queryAdd(){
                this.$axios.post("administration/coupon/add",this.addjuan).then(response=>{
                    if (response.data==2){
                        alert("添加成功")
                        this.feny()
                        this.addjuan.cpEndTime=""
                        this.addjuan.cpBeginTime=""
                        this.addjuan.cpNum=""
                        this.addjuan.cpContent=""
                        this.addjuan.cePrice=""
                        this.addjuan.cpName=""
                    }
                })
            },
            delet(id){
                let  c=confirm("确定要删除？")
                if (c==true){
                    this.$axios.post("administration/coupon/queryDelt",id).then(response=>{
                        if (response.data!=0){
                            alert("删除成功")
                        }
                    })
                }
            }
        }
    }
</script>

<style scoped>
    .boudoy{
        width: 80vw;
    }
    ul li{
        list-style: none
    }
</style>